import * as Matter from 'matter-js';
import * as PIXI from "pixi.js";
import { App } from '../system/App';
// [10]
import { Diamond } from './Diamond';
import { BasketBoard } from "@/components/pages/game/ball/comp/game/BasketBoard";
import { BasketRim } from "@/components/pages/game/ball/comp/game/BasketRim";
import { BasketBoardRight } from "@/components/pages/game/ball/comp/game/BasketBoardRight";
import { BasketRimRight } from "@/components/pages/game/ball/comp/game/BasketRimRight";
import { BasketNet } from "@/components/pages/game/ball/comp/game/BasketNet";

// [/10]

export class BasketGroupRight {
  constructor(x, y) {
    this.width = App.config.basket.board.width + App.config.basket.rim.width;
    this.height = App.config.basket.board.height;
    this.speed = App.config.bgSpeed;

    this.elements = [];

    this.createContainer(x, y);
    this.createNet(App.config.basket.board.width, App.config.basket.board.height - 25);
    this.createRim(x, y);
    this.createBoard(x, y);
    // this.createDiamond(x, y);

    this.dx = App.config.platforms.moveSpeed;
    this.currentY = y
    // this.createBody();
  }

  // [10]

  createDiamond(x, y) {
    const diamond = new Diamond(x, y);
    this.container.addChild(diamond.sprite);
    diamond.createBody();
    this.elements.push(diamond);
  }

  createNet(x, y) {
    this.net = new BasketNet(x, y);
    this.container.addChild(this.net.animatedSprite);
    // net.createBody();
    this.net.createNet();
    this.elements.push(this.net);
  }

  createBoard(x, y) {
    const board = new BasketBoardRight(x, y);
    this.container.addChild(board.sprite);
    board.createBody();
    this.elements.push(board);
  }

  createRim(x, y) {
    const rim = new BasketRimRight(x, this.height);
    this.container.addChild(rim.sprite);
    rim.createBody();
    this.elements.push(rim);
  }
  // [/10]

  createBody() {
    this.body = Matter.Bodies.rectangle(this.width / 2 + this.container.x, this.height / 2 + this.container.y, this.width, this.height, {
      isStatic: true,
      render: {
        fillStyle: 'red',
        lineWidth: 3,
      }
    });
    Matter.World.add(App.physics.world, this.body);
  }

  createContainer(x, y) {
    this.container = new PIXI.Container();
    this.container.x = x;
    this.container.y = y;
  }

  update(dt, y, fangxiang) {
    // console.log('BasketGroup', this.currentY)

    // if (this.currentY !== y) {
    //   this.cooldown += 1;
    //   this.currentY = y;
    // }
    //
    // if (this.cooldown > 10) {
    //   this.container.y = this.currentY - this.height * 2;
    //   this.cooldown = 0;
    // }

    // this.currentY = y;
    this.elements.forEach(ele => ele.move(dt * 2, y));
    // const offset = this.speed * dt;
    this.move(dt, y)
    // setTimeout(()=>{
    //   this.container.y = y - this.height;
    // }, 1000);
    if (fangxiang) {
      this.container.y = y - this.height;
    }
    // this.container.y = y - this.height;
    // this.container.y = y - this.height;
    // console.log('BasketGroup', offset)
  }

  fire() {
    this.net.tail.gotoAndPlay(0);
    // this.net.animatedSprite.x = 100;
    // this.net.animatedSprite.y = 100;
    // this.net.animatedSprite.gotoAndPlay(0);

  }

  // 06
  move(offset) {
    // console.log('BasketGroupRight', offset)
    if (offset > 0) {
      if (this.container.x < window.innerWidth + this.width + 50) {
        this.container.x = this.container.x + offset;
        // Matter.Body.setPosition(this.body, {x: this.body.position.x + offset, y: this.body.position.y});
      }
    } else {
      if (this.container.x > window.innerWidth - this.width - 10) {
        this.container.x = this.container.x + offset;
        // Matter.Body.setPosition(this.body, {x: this.body.position.x + offset, y: this.body.position.y});
      }
    }
  }

  destroy() {
    // Matter.World.remove(App.physics.world, this.body);
    this.container.destroy();
  }
}